| 1 |
|
<![CDATA[
Widget build(BuildContext context) {
return Material(
color: Colors.blue,
child: SafeArea(
child: SizedBox.expand(
child: Card(color: Colors.yellowAccent),
),
),
);
}
]]>
|
| 1 |
|
<![CDATA[
Row (
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Icon(Icons.star, size: 50),
Icon(Icons.star, size: 50),
Icon(Icons.star, size: 50),
],
),
]]>
|
| 2 |
|
<![CDATA[
Column (
mainAxisAlignment: MainAxisAlignment.start,
children: <Widget>[
Icon(Icons.star, size: 50),
Icon(Icons.star, size: 50),
Icon(Icons.star, size: 50),
],
),
]]>
|
| 3 |
|
<![CDATA[
Row (
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Icon(Icons.star, size: 50),
Icon(Icons.star, size: 50),
Icon(Icons.star, size: 50),
],
),
]]>
|
| 4 |
|
<![CDATA[
Column (
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Icon(Icons.star, size: 50),
Icon(Icons.star, size: 50),
Icon(Icons.star, size: 50),
],
),
]]>
|
| 5 |
|
<![CDATA[
Row (
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
Icon(Icons.star, size: 50),
Icon(Icons.star, size: 50),
Icon(Icons.star, size: 50),
],
),
]]>
|
| 6 |
|
<![CDATA[
Column (
mainAxisAlignment: MainAxisAlignment.end,
children: <Widget>[
Icon(Icons.star, size: 50),
Icon(Icons.star, size: 50),
Icon(Icons.star, size: 50),
],
),
]]>
|
| 7 |
|
<![CDATA[
Row (
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Icon(Icons.star, size: 50),
Icon(Icons.star, size: 50),
Icon(Icons.star, size: 50),
],
),
]]>
|
| 8 |
|
<![CDATA[
Column (
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Icon(Icons.star, size: 50),
Icon(Icons.star, size: 50),
Icon(Icons.star, size: 50),
],
),
]]>
|
| 8 |
|
<![CDATA[
Container(
height: 55,
padding: const EdgeInsets.all(12),
//for round shape
decoration: BoxDecoration(
color: state.white,
borderRadius: BorderRadius.circular(25),
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.25),
spreadRadius: 5,
blurRadius: 7,
offset: const Offset(1, 6), // Shadow position
),
],
),
child: Row(
children: const [
//leftside icon
Icon(
Icons.search,
// color: Colors.black,
size: 30,
),
//right side text
Text(
' Search for members',
style: TextStyle(color: Colors.grey, fontSize: 16),
)
],
),
),
]]>
|
| 8 |
|
<![CDATA[
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
//Left side text
const Text(
'Profile',
style: TextStyle(
// color: Colors.black,
fontSize: 38,
fontWeight: FontWeight.w500),
),
//right side icons
Row(
children: [
//icon 1
Container(
width: 50,
height: 50,
decoration: BoxDecoration(
color: state.white,
shape: BoxShape.circle,
),
child: const Icon(
CupertinoIcons.pencil_ellipsis_rectangle),
),
const SizedBox(
width: 15,
),
//icon 2
Container(
width: 50,
height: 50,
decoration: BoxDecoration(
color: state.white,
shape: BoxShape.circle,
),
child: InkWell(
onTap: () {
ref.read(appController.notifier).changeTheme();
},
child: const Icon(Icons.settings_outlined)),
),
],
)
],
),
]]>
|
| 8 |
|
<![CDATA[
Row(
children: [
//left side profile image
Padding(
padding: const EdgeInsets.all(10.0),
child: ClipRRect(
borderRadius: BorderRadius.circular(80),
child: Image.network(
'https://encrypted-tbn0.gstatic.com/profile1.png',
fit: BoxFit.cover,
height: 100,
width: 100,
),
),
),
//for 3 lines
Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Adam',
style: TextStyle(
fontSize: 21,
),
),
const SizedBox(
height: 6,
),
Text(
'Hey! Here to sell stuff that I forgot\n they exist!',
style: TextStyle(fontSize: 15, color: Colors.grey[500]),
),
const SizedBox(
height: 11,
),
// for 2 cols
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: const [
Text(
'Followers:49',
style: TextStyle(fontSize: 15, color: Colors.grey),
),
SizedBox(
width: 30,
),
Text(
'Following:81',
style: TextStyle(fontSize: 15, color: Colors.grey),
),
],
),
],
)
],
),
]]>
|
| 8 |
|
<![CDATA[
// Padding layout for surrounding spaces
Padding(
padding: const EdgeInsets.all(12.0),
// Container layout for round shape
child: Container(
height: 55,
padding: const EdgeInsets.all(12),
decoration: BoxDecoration(
color: state.white,
borderRadius: BorderRadius.circular(25),
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.25),
spreadRadius: 5,
blurRadius: 7,
offset: const Offset(1, 6), // Shadow position
),
],
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
//left side stars
Row(
children: [
const Icon(
Icons.star,
color: Colors.yellow,
size: 30,
),
const Icon(
Icons.star,
color: Colors.yellow,
size: 30,
),
const Icon(
Icons.star,
color: Colors.yellow,
size: 30,
),
const Icon(
Icons.star,
color: Colors.yellow,
size: 30,
),
Icon(
Icons.star,
color: Colors.grey[300],
size: 30,
),
],
),
//right side text
const Text(
'41 Reviews',
style: TextStyle(color: Colors.grey, fontSize: 16),
)
],
),
),
),
]]>
|
| 8 |
|
<![CDATA[
Expanded(
child: Container(
color: Colors.black,
child: SingleChildScrollView(
child: Column(
children: [
// Padding layout for item padding
Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
children: [
Expanded(
// Padding layout for item padding
child: Padding(
padding: const EdgeInsets.only(left: 12.0, right: 8),
// Container layout for item decoration
child: Container(
padding: const EdgeInsets.all(10),
height: 250,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(25),
color: Colors.white,
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// add sub layouts
],
),
), //end of Container
), //end of Padding
),
// add send item
]
) //end row
) // end padding
// repeat second row boxes
]
) // end col
) // end SingleChildScrollView
) end Container
) // end Expanded
]]>
|
| 8 |
|
<![CDATA[
Column(
children: [
ListTile(
leading: ClipRRect(
borderRadius: BorderRadius.circular(80),
child: Image.network(
'https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxzZWFyY2h8Mnx8ZmFjZXxlbnwwfHwwfHx8MA%3D%3D&w=1000&q=80',
fit: BoxFit.cover,
height: 60,
width: 60,
),
),
title: const Text('Jake'),
subtitle: Text(
'There are no major defects or damages..',
style: TextStyle(color: state.black),
),
trailing: const Text(
'Now',
// style: TextStyle(color: Colors.black),
),
),
const SizedBox(
height: 10,
),
//repeat ListTile
]
)
]]>
|
| 8 |
|
<![CDATA[
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
// Container layout for decoration
Container(
height: screenSize.height * 0.065,
width: screenSize.width * 0.115,
decoration: BoxDecoration(
color: lbackgroundclr,
borderRadius: BorderRadius.circular(15)),
child: const Icon(
Icons.sort_rounded,
color: whiteclr,
),
),
Column(
children: [
const Text(
"Deliver to",
style: TextStyle(
color: whiteclr,
fontSize: 17,
fontWeight: FontWeight.w500),
),
SizedBox(
height: screenSize.height * 0.002,
),
const Text(
"02-075 Konstructorska 9",
style: TextStyle(
color: primaryclr,
fontSize: 15,
),
),
],
),
// Container layout for decoration
Container(
height: screenSize.height * 0.065,
width: screenSize.width * 0.115,
decoration: BoxDecoration(
image: const DecorationImage(
fit: BoxFit.cover,
image: NetworkImage(
"https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRz-LJaTp0HFRT2GHznf3n7iSAzu-z7och7Vc0GsJkTHWEk67OjQ0t0o6piSTpTv9sr7UI&usqp=CAU")),
color: lbackgroundclr,
borderRadius: BorderRadius.circular(15)),
),
],
),
]]>
|
| 8 |
|
<![CDATA[
SizedBox(
height: screenSize.height * 0.185,
//for list view
child: ListView.builder(
shrinkWrap: true,
physics: const ScrollPhysics(),
scrollDirection: Axis.horizontal, // for horizontal listing
itemCount: smallcon.length,
itemBuilder: ((context, index) {
//padding layout for padding between the items
return Padding(
padding: const EdgeInsets.all(5.0),
child: InkWell(
onTap: (() {
Navigator.push(
context,
MaterialPageRoute(
builder: ((context) => DetailScreen(
details: smallcon[index],
detail: BigCon[index],
)),
),
);
}),
//Container layout for outer decoration
child: Container(
width: screenSize.width * 0.22,
decoration: BoxDecoration(
color: lbackgroundclr,
borderRadius: BorderRadius.circular(55),
),
child: Padding(
padding: const EdgeInsets.all(4.0),
child: Column(
children: [
//Container layout for inner round shaped image
Container(
height: screenSize.height * 0.1,
width: screenSize.width * 0.2,
decoration: BoxDecoration(
image: DecorationImage(
fit: BoxFit.cover,
image: NetworkImage(
smallcon[index].image)),
shape: BoxShape.circle),
),
SizedBox(
height: screenSize.height * 0.015,
),
Text(
smallcon[index].name,
style: const TextStyle(color: whiteclr),
),
],
),
),
),
),
);
}),
),
),
]]>
|
| 8 |
|
<![CDATA[
SizedBox(
height: screenSize.height * 0.357,
//for list ListView
child: ListView.builder(
shrinkWrap: true,
physics: const ScrollPhysics(),
scrollDirection: Axis.horizontal, //for horizontal listing
itemCount: BigCon.length,
itemBuilder: ((context, index) {
//padding layout for item padding
return Padding(
padding: const EdgeInsets.all(7.0),
//stack layout for favorite_rounded icon
child: Stack(
children: [
//InkWell to apply touch event to the entire item box
InkWell(
onTap: (() {
Navigator.push(
context,
MaterialPageRoute(
builder: ((context) => DetailScreen(
details: smallcon[index],
detail: BigCon[index],
)),
),
);
}),
//Container for round shapped item box
child: Container(
width: screenSize.width * 0.65,
decoration: BoxDecoration(
color: lbackgroundclr,
borderRadius: BorderRadius.circular(15),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
height: screenSize.height * 0.19,
width: screenSize.width * 0.65,
decoration: BoxDecoration(
image: DecorationImage(
fit: BoxFit.cover,
image:
NetworkImage(BigCon[index].image),
),
borderRadius: const BorderRadius.only(
topLeft: Radius.circular(15),
topRight: Radius.circular(15),
),
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
children: [
Row(
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Text(
BigCon[index].name,
style: const TextStyle(
color: whiteclr,
fontSize: 17,
fontWeight:
FontWeight.w500),
),
Row(
children: [
const Icon(
Icons.alarm,
size: 16,
color: Color(
0xff513330,
),
),
Text(
BigCon[index].time,
style: const TextStyle(
fontSize: 15,
color: whiteclr),
),
],
),
],
),
SizedBox(
height: screenSize.height * 0.005,
),
Row(
children: [
const Icon(
Icons.star,
color: Color(0xffFCD506),
size: 16,
),
Text(
BigCon[index].ratting,
style: const TextStyle(
fontSize: 14.5,
color: whiteclr),
),
],
),
SizedBox(
height: screenSize.height * 0.009,
),
Row(
children: [
//Container for decoration
Container(
decoration: BoxDecoration(
borderRadius:
BorderRadius.circular(
12),
color: const Color(
0xff40404B)),
height:
screenSize.height * 0.045,
width: screenSize.width * 0.2,
child: const Center(
child: Text(
"Fastfood",
style: TextStyle(
fontWeight:
FontWeight.w500,
color: whiteclr),
),
),
),
SizedBox(
width: screenSize.width * 0.025,
),
//Container for decoration
Container(
decoration: BoxDecoration(
borderRadius:
BorderRadius.circular(
12),
color: const Color(
0xff40404B)),
height:
screenSize.height * 0.045,
width: screenSize.width * 0.2,
child: const Center(
child: Text(
"Chicken",
style: TextStyle(
fontWeight:
FontWeight.w500,
color: whiteclr),
),
),
),
SizedBox(
width: screenSize.width * 0.025,
),
//Container for decoration
Container(
decoration: BoxDecoration(
borderRadius:
BorderRadius.circular(
12),
color: const Color(
0xff40404B)),
height:
screenSize.height * 0.045,
width: screenSize.width * 0.12,
child: const Center(
child: Text(
"Fries",
style: TextStyle(
fontWeight:
FontWeight.w500,
color: whiteclr),
),
),
),
],
),
],
),
),
],
),
),
),
//Positioned for placing favorite icon at top right of the item box
const Positioned(
right: 0,
child: Padding(
padding: EdgeInsets.all(6.0),
child: Icon(
Icons.favorite_rounded,
size: 25,
color: whiteclr,
)),
)
],
),
);
}),
]]>
|
| 8 |
|
<![CDATA[
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
SizedBox(
height: sc.height * 0.010,
),
Text(
widget.details.name2,
style: const TextStyle(
fontSize: 21.5,
fontWeight: FontWeight.bold,
color: whiteclr),
),
SizedBox(
height: sc.height * 0.010,
),
Row(
children: [
const Icon(
Icons.star,
color: Color(0xffFCD506),
size: 16,
),
Text(
widget.details.ratting,
style:
const TextStyle(fontSize: 12.5, color: whiteclr),
),
],
),
SizedBox(
height: sc.height * 0.01,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
widget.details.price,
style: const TextStyle(
fontSize: 22,
fontWeight: FontWeight.bold,
color: whiteclr),
),
Row(
children: [
Container(
height: sc.height * 0.050,
width: sc.width * 0.08,
decoration: const BoxDecoration(
color: lbackgroundclr,
shape: BoxShape.circle),
child: const Center(
child: Icon(
Icons.remove,
color: whiteclr,
),
),
),
SizedBox(
width: sc.width * 0.04,
),
const Text(
"1",
style: TextStyle(
fontSize: 22,
color: whiteclr,
fontWeight: FontWeight.bold),
),
SizedBox(
width: sc.width * 0.04,
),
Container(
height: sc.height * 0.050,
width: sc.width * 0.08,
decoration: const BoxDecoration(
color: lbackgroundclr,
shape: BoxShape.circle),
child: const Center(
child: Icon(
Icons.add,
color: whiteclr,
)),
)
],
)
],
),
SizedBox(
height: sc.height * 0.006,
),
Text(
widget.details.description,
style: TextStyle(
fontSize: 15,
color: Colors.grey[400],
),
),
]]>
|
| 8 |
|
<![CDATA[
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Container(
height: sc.height * 0.080,
width: sc.width * 0.15,
decoration: const BoxDecoration(
image: DecorationImage(
fit: BoxFit.cover,
image: AssetImage("assets/creamcheese.png"),
),
color: Color(0xff3A3843),
shape: BoxShape.circle),
),
SizedBox(
width: sc.width * 0.03,
),
const Text(
"Cream Cheese",
style: TextStyle(
color: whiteclr,
fontSize: 16,
fontWeight: FontWeight.w500),
),
SizedBox(
width: sc.width * 0.22,
),
Row(
children: [
const Text(
"\$${10}",
style: TextStyle(color: whiteclr, fontSize: 16),
),
Radio(
value: 1,
groupValue: _value,
onChanged: (int? value) {
setState(() {
_value = value!;
});
}),
],
),
],
),
SizedBox(
height: sc.height * 0.015,
),
Row(
children: [
Container(
height: sc.height * 0.080,
width: sc.width * 0.15,
decoration: const BoxDecoration(
image: DecorationImage(
fit: BoxFit.cover,
image: AssetImage("assets/avocado.png"),
),
color: Color(0xff3A3843),
shape: BoxShape.circle),
),
SizedBox(
width: sc.width * 0.03,
),
const Text(
"Avocado",
style: TextStyle(
color: whiteclr,
fontSize: 16,
fontWeight: FontWeight.w500),
),
SizedBox(
width: sc.width * 0.328,
),
Row(
children: [
const Text(
"\$${11}",
style: TextStyle(color: whiteclr, fontSize: 16),
),
Radio(
value: 2,
groupValue: _value,
onChanged: (int? value) {
setState(() {
_value = value!;
});
}),
],
),
],
),
SizedBox(
height: sc.height * 0.015,
),
Row(
children: [
Container(
height: sc.height * 0.080,
width: sc.width * 0.15,
decoration: const BoxDecoration(
image: DecorationImage(
fit: BoxFit.cover,
image: NetworkImage(
"https://upload.wikimedia.org/wikipedia/commons/9/9d/Tomato.png"),
),
color: Color(0xff3A3843),
shape: BoxShape.circle),
),
SizedBox(
width: sc.width * 0.0305,
),
const Text(
"Tomato",
style: TextStyle(
color: whiteclr,
fontSize: 16,
fontWeight: FontWeight.w500),
),
SizedBox(
width: sc.width * 0.35,
),
Row(
children: [
const Text(
"\$${13}",
style: TextStyle(color: whiteclr, fontSize: 16),
),
Radio(
value: 3,
groupValue: _value,
onChanged: (int? value) {
setState(() {
_value = value!;
});
}),
],
),
],
),
SizedBox(
height: sc.height * 0.015,
),
]
)
]]>
|
| 8 |
|
<![CDATA[
Center(
child: Container(
height: sc.height * 0.06,
width: sc.width * 0.75,
decoration: BoxDecoration(
color: primaryclr,
borderRadius: BorderRadius.circular(12),
),
child: const Center(
child: Text(
"Add to card",
style: TextStyle(
fontSize: 15,
color: whiteclr,
),
),
),
),
),
]]>
|
MANVIA BLOG